﻿<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>google地图通信测试</title>
    <meta name="viewport" content="initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0" />
     
    <script src="js/jquery-1.6.4.js" type="text/javascript"></script>
    <script src="js/WebSocketEx.js" type="text/javascript"></script>
    <style type="text/css">
      html { height: 100% }
      body { height: 100%; margin: 0; padding: 0 }
      #map-canvas { height: 100% }
     
    </style>
    <script type="text/javascript"
      src="https://maps.googleapis.com/maps/api/js?key=AIzaSyC3edxpksofvFKMQ08p8OQVA0V84j-dZ9w&sensor=true">
    </script>
    <script type="text/javascript">

        $(function () {
            type = "wssCtName";
            connectSocketServer();
            sState = 0;
            sType = 0;
            var initialize = function () {
                mapOptions = {
                    zoom: 2,
                    center: new google.maps.LatLng(39.5427, 116.2317),
                    mapTypeId: google.maps.MapTypeId.ROADMAP
                };

                map = new google.maps.Map(document.getElementById('map-canvas'),
      mapOptions);

              

                google.maps.event.addListener(map, 'idle', function () {

                    var cen = map.center + "";
                    cen = cen.substring(1, cen.length - 1);
                    var strs = cen.split(",");
                    var jingdu = strs[0];
                    var weidu = strs[1];
                    

                  sendMessage("COMMAND CommandName:GisLocation;Lon:" + weidu + ";Lat:" + jingdu + ";ZoomLevel:" + map.zoom + ";ID:" + 0); //COMMAND 控制命令
                    //sendMessage("COMMAND CommandName:GisLocation;Lon:101.77507265625;Lat:43.891391652121;ZoomLevel:4;ID:0"); //COMMAND 控制命令
                    //document.getElementById("foo").click()
                });

                google.maps.event.addListener(marker, 'click', function () {
                    map.setZoom(4);
                    map.setCenter(marker.getPosition());
                });
                google.maps.event.addListener(marker1, 'click', function () {
                    map.setZoom(4);
                    map.setCenter(new google.maps.LatLng(46.28, 125.07));
                });
            }
            var mapOptions;
            var map;
            var marker;
            var england;
            var sjingdu, sweidu, szoom;
            england = function () {
                if (sType == 0) {
                    map.setZoom(szoom);
                    map.setCenter(new google.maps.LatLng(sjingdu, sweidu));
                }

            };
            initialize();
        })
    </script>
    
  </head>
  <body>


  <div style="width:3236px;height:788px;margin: 0 auto;">
    <div id="map-canvas" />
    </div>
  </body>
</html>
